<template>
  <div>子级</div>
  <!-- 方法一 -->
  <!-- <div>值：{{titleStr.title}}</div>
  <div>值：{{title}}</div> -->

  <!-- 方法二 -->
  <!-- <div>值：{{props.title}}</div>
  <div>值：{{props.arr}}</div> -->

  <div>值：{{title}}</div>
  <div>值：{{arr}}</div>
</template>

<script setup lang="ts">

// 接收父组件传递过来的值 defineProps

// 方法一
/* const titleStr = defineProps({
  title: {
    type: String,       // 必须是大写String
    default: "默认值"
  }
})

console.log(titleStr.title) */

// 方法二
/* const props = defineProps<{
  title: string,
  arr: number[]
}>() */

// ts 特有的定义默认值 withDefaults
withDefaults(defineProps<{
  title: string,
  arr: number[]
}>(), {
  title: "默认值",
  arr: () => []
})

</script>